{% extends 'base.html' %}

{% block content %}
<div class="container">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2>电影列表</h2>
        {% if current_user.is_authenticated %}
        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addMovieModal">
            添加电影
        </button>
        {% endif %}
    </div>

    <div class="row">
        {% for movie in movies %}
        <div class="col-md-3 mb-4">
            <div class="card h-100">
                {% if movie.poster_url %}
                <img src="{{ movie.poster_url }}" class="card-img-top" alt="{{ movie.title }}">
                {% endif %}
                <div class="card-body">
                    <h5 class="card-title" data-toggle="tooltip" title="{{ movie.title }}">
                        {{ movie.title[:20] }}{% if movie.title|length > 20 %}...{% endif %}
                    </h5>
                    <p class="card-text">
                        <small class="text-muted">{{ movie.year }}</small>
                        {% if movie.rating %}
                        <span class="badge badge-warning float-right">{{ "%.1f"|format(movie.rating) }}</span>
                        {% endif %}
                    </p>
                    {% if movie.director %}
                    <p class="card-text"><small>导演: {{ movie.director }}</small></p>
                    {% endif %}
                    {% if movie.description %}
                    <p class="card-text text-muted small">
                        {{ movie.description[:100] }}{% if movie.description|length > 100 %}...{% endif %}
                    </p>
                    {% endif %}
                    <div class="btn-group">
                        <a href="https://www.kkys02.com/search?os=pc&k={{ movie.title }}" 
                           class="btn btn-sm btn-primary" target="_blank">观看</a>
                        {% if current_user.is_authenticated %}
                        <a href="{{ url_for('edit', movie_id=movie.id) }}" 
                           class="btn btn-sm btn-secondary">编辑</a>
                        <button type="button" class="btn btn-sm btn-info" 
                                onclick="showReviewModal({{ movie.id }})">评论</button>
                        <form class="d-inline" method="post" action="{{ url_for('delete', movie_id=movie.id) }}">
                            <button type="submit" class="btn btn-sm btn-danger" 
                                    onclick="return confirm('确定要删除这部电影吗？')">删除</button>
                        </form>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
        {% endfor %}
    </div>
</div>

{% if current_user.is_authenticated %}
<!-- 添加电影的模态框 -->
<div class="modal fade" id="addMovieModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">添加电影</h5>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <form method="post" action="{{ url_for('add_movie') }}">
                <div class="modal-body">
                    <div class="form-group">
                        <label for="title">电影名称</label>
                        <input type="text" class="form-control" id="title" name="title" required>
                    </div>
                    <div class="form-group">
                        <label for="year">上映年份</label>
                        <input type="text" class="form-control" id="year" name="year" 
                               pattern="\d{4}" title="请输入4位数字的年份" required>
                    </div>
                    <div class="form-group">
                        <label for="director">导演</label>
                        <input type="text" class="form-control" id="director" name="director">
                    </div>
                    <div class="form-group">
                        <label for="category">分类</label>
                        <select class="form-control" id="category" name="category">
                            <option value="">请选择</option>
                            <option value="动作">动作</option>
                            <option value="喜剧">喜剧</option>
                            <option value="爱情">爱情</option>
                            <option value="科幻">科幻</option>
                            <option value="动画">动画</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="description">简介</label>
                        <textarea class="form-control" id="description" name="description" rows="3"></textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                    <button type="submit" class="btn btn-primary">添加</button>
                </div>
            </form>
        </div>
    </div>
</div>
{% endif %}
{% endblock %} 